<script setup>
import { ref } from 'vue';
import { useRouter, useRoute } from 'vue-router';

let username = ref('');
let password = ref('');
let msg = ref('');
const router = useRouter();
const route = useRoute();

const login = () => {
    // 模拟后台效验
    if (username.value == 'dnt' && password.value == 'dnt') {
        window.localStorage.setItem('login', 'ok')
        console.log('redirect:',route.query.redirect)
        // redirect不为空，并且只是站内跳转
        if (!route.query.redirect) {
            // 跳转到默认的管理页面
            router.push('/Admin')
        } else {
            router.push(route.query.redirect)
        }
    } else {
        msg.value = '用户名或密码错误！';
    }
}
</script>

<template>
    <h2>{{ msg }}</h2>
    <div>
        <input v-model="username" type="text" /><br />
        <input v-model="password" type="password" @keyup.enter="login" /><br />
        <button @click="login">登录</button>
    </div>
</template>

<style scoped>
h2 {
    color: red;
}
</style>